
<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<title>Our Love Story</title>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
	<style type="text/css">
		@font-face {
			font-family: digit;
			src: url('digital-7_mono.ttf') format("truetype");
		}
	</style>
	<link href="default.css" type="text/css" rel="stylesheet">
	<script type="text/javascript" src="jquery.js"></script>
	<script type="text/javascript" src="garden_dev.js"></script>
    <script type="text/javascript" src="functions_dev.js"></script>
</head>

<body>
	<div id="mainDiv">
		<div id="content">
			<div id="code">
				<span class="comments">/**</span><br />
				<span class="space"/><span class="comments">* Spring：你给我听好 !</span><br />
				<span class="space"/><span class="comments">* 第一次遇见的时候，我就知道，这辈子要等的人终于出现了</span><br />
				<span class="space"/><span class="comments">* 你是那么的迷人，以致于我已经无法自拔</span><br />
				<span class="space"/><span class="comments">* 你的一切都在吸引着我</span><br />
				<span class="space"/><span class="comments">* 你微笑的脸庞</span><br />
				<span class="space"/><span class="comments">* 你恬静的性格 </span><br />
				<span class="space"/><span class="comments">* 你温暖的目光</span><br />
				<span class="space"/><span class="comments">* 你可爱的模样</span><br />
				<span class="space"/><span class="comments">* 你的处处为人着想</span><br />
				<span class="space"/><span class="comments">  </span><br />
				<span class="space"/><span class="comments">* 当你靠着我的时候，内心有从来没有过的安逸平静，多希望一辈子就这么过去</span><br />
				<span class="space"/><span class="comments">* 但未来的路必定是坎坷的</span><br />
				<span class="space"/><span class="comments">* 我愿意用自己一生的努力替你踏平前方的坎坷</span><br />
				<span class="space"/><span class="comments">* 换你一世幸福</span><br />
				<span class="space"/><span class="comments">  </span><br />
				<span class="space"/><span class="comments">* 谢谢你可以在我一无所有的时候</span><br />
				<span class="space"/><span class="comments">* 接受我，爱着我</span><br />
				<span class="space"/><span class="comments">* 我会用自己的行动证明，你没有看错！</span><br />
				<span class="space"/><span class="comments">  </span><br />
				<span class="space"/><span class="comments">* 希望，到父母般的年纪</span><br />
				<span class="space"/><span class="comments">* 我们也能够跟他们一样依然相互爱着</span><br />
				<span class="space"/><span class="comments">* 把另一半当成崇拜的对象</span><br />
				<span class="space"/><span class="comments">* 一辈子不离不弃 </span><br />
				<span class="space"/><span class="comments">* 生死相随</span><br />
				<span class="space"/><span class="comments">* 不管是富有或贫穷，健康或疾病</span><br />
				<span class="space"/><span class="comments">* 爱着彼此.相互支持</span><br />
				<span class="space"/><span class="comments">  </span><br />
				<span class="space"/><span class="comments">* 2018年，在所有的亲人的见证下</span><br />
				<span class="space"/><span class="comments">* 我会给你一个浪漫的婚礼</span><br />
				<span class="space"/><span class="comments">* 然后，一起期待第一个孩子的降临</span><br />
				<span class="space"/><span class="comments">* 那将是我们爱的结晶</span><br />
				<span class="space"/><span class="comments">*/</span><br />
												
			</div>
			<div id="loveHeart">
				<canvas id="garden"></canvas>
				<div id="words">
					<div id="messages">
						Spring, I have fallen in love with you for
						<div id="elapseClock"></div>
					</div>
					<div id="loveu">
						Love u forever and ever.<br/>
						<div class="signature">- yujinlong</div>
					</div>
				</div>
			</div>
		</div>
		<div id="copyright">
			
		</div>
	</div>
	<script type="text/javascript">
		var offsetX = $("#loveHeart").width() / 2;
		var offsetY = $("#loveHeart").height() / 2 - 55;
		var displayMode = 1;
		var together = new Date();
		together.setFullYear(2017, 3, 25);
		together.setHours(12	);
		together.setMinutes(0);
		together.setSeconds(0);
		together.setMilliseconds(0);
		
		$("#loveHeart").click(function(){
			displayMode *= -1;
			timeElapse(together, displayMode);
		});
		
		if (!document.createElement('canvas').getContext) {
			var msg = document.createElement("div");
			msg.id = "errorMsg";
			msg.innerHTML = "Your browser doesn't support HTML5!<br/>Recommend use Chrome 14+/IE 9+/Firefox 7+/Safari 4+"; 
			document.body.appendChild(msg);
			$("#code").css("display", "none")
			$("#copyright").css("position", "absolute");
			$("#copyright").css("bottom", "10px");
		    document.execCommand("stop");
		} else {
			setTimeout(function () {
				adjustWordsPosition();
				startHeartAnimation();
			}, 5000);

			timeElapse(together, displayMode);
			setInterval(function () {
				timeElapse(together, displayMode);
			}, 500);

			adjustCodePosition();
			$("#code").typewriter();
		}
	</script>
</body>
</html>
